<template>
    <van-nav-bar title="首页" />
    <van-search v-model="value" shape="round" background="#4fc08d" placeholder="请输入搜索关键词" @search="searchval" />
    <van-skeleton title :row="5"/>
    <van-tabs v-model:active="active" animated>
        <van-tab title="首页"></van-tab>
        <van-tab title="影视"></van-tab>
        <van-tab title="美食"></van-tab>
        <van-tab title="音乐"></van-tab>
        <van-tab title="电影"></van-tab>
    </van-tabs>
    <van-swipe :autoplay="3000" lazy-render>
        <van-swipe-item v-for="image in images" :key="image">
            <img :src="image" style="width: 100%;height: 200px;"/>
        </van-swipe-item>
    </van-swipe>
</template>

<script setup>

import { ref } from 'vue'
 const images = [
      'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg',
      'https://fastly.jsdelivr.net/npm/@vant/assets/apple-2.jpeg',
      'https://fastly.jsdelivr.net/npm/@vant/assets/apple-3.jpeg',
      'https://fastly.jsdelivr.net/npm/@vant/assets/apple-4.jpeg',
      
    ];
import { useRouter } from 'vue-router'
let router = useRouter()
let active = ref(0)
let msdata = ref(5)
let status = ref(true)
let timer = setInterval(() => {
    msdata.value--
    if (msdata.value == 0) {
        clearInterval(timer)
        msdata.value = 5;
        status.value = false
    }
}, 1000);
const searchval = () => {
    router.push('/Search')
}
</script>

<style lang="scss" scoped>

</style>